/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 2017-8-18, 11:07:54
    Author     : Snake
*/

* { margin: 0; padding: 0;}

body { 
    fon-size: 16px;
    font-family: '微软雅黑','Raleway', sans-serif;
}

a {
    text-decoration:none; 
    outline:none; 
    color:#333;
    font-family: '微软雅黑','Raleway', sans-serif;
    noFocusLine: expression(this.onFocus = this.blur());
}

li { list-style: none; font-size: 14px; font-family: '微软雅黑','Raleway', sans-serif; }

.clear { clear: both; }

.center { font-size: 14px;text-align: center;font-family: '微软雅黑','Raleway', sans-serif; }

span { font-size: 14px;font-family: '微软雅黑','Raleway', sans-serif; }

h1,h2,h3,h4,h5,h6,h7,h8,h9 { font-family: '微软雅黑','Raleway', sans-serif; }

/* ----------------------------------------------------------------
        头部.菜单导航( PC/Phone )
-----------------------------------------------------------------*/
.tongl{
    width:100%;
    height:80px; 
    background:#1e1e1e;
    position:fixed;
    z-index:100;
    top:0;
    left:0;
}
.tongl2{
    width:100%;
    height:80px; 
    background:#FFFFFF;
    border-bottom: 1px solid #dfdfdf;
    position:fixed;
    z-index:100;
    top:0;
    left:0; 
    display:none;
}

.hblogo {  
    left:4%;
    height:58px; 
    z-index:9; 
    position: absolute;
}

.nav {
    width: 34px;
    height:34px;
    position: fixed;
    right:4%;
    top:25px;
    cursor: pointer;
    display: table;
    transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -webkit-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -ms-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    z-index:9999;
}

.navtop2 { 
    position: absolute;
    right:4%; 
    top:10px; 
    z-index:100;
}

.navtop2 ul li { 
    list-style-type:none; 
    float:left; 
}

.navtop2 ul li a {
    display: block;
    color: #aaa; 
    font-size:16px;
    line-height: 28px;
    padding: 0 36px;
    text-align: center;
}

.navtop2 ul li a:hover { 
    color:#fff; 
    font-size:16px;
    border-top: solid 2px #ff4900;
    background: #292929;
}

.nav.selected {
    transform: rotate(90deg);
}

.nav a {
    display: block;
    height: 4px;
    margin-top: 16px;
    position: relative;
    top: 50%;
    width: 100%;
    transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
}

.nav a.act{ background-color:#08903d;}

.nav a.act:after,.nav a.act:before{ background-color:#08903d;display:table; content:'';}

.nav:hover a:before {
    transform: translateY(-2px) rotate(0deg);
    -webkit-transform: translateY(-2px) rotate(0deg);
    -ms-transform: translateY(-2px) rotate(0deg);
}

.nav:hover a:after {
    transform: translateY(2px) rotate(0deg);
    -webkit-transform: translateY(2px) rotate(0deg);
    -ms-transform: translateY(2px) rotate(0deg);
}

.nav.close:hover a:before {
    transform: translateY(0px) rotate(-55deg);
    -webkit-transform: translateY(0px) rotate(-55deg);
    -ms-transform: translateY(0px) rotate(-55deg);
}

.nav.close:hover a:after {
    transform: translateY(0px) rotate(55deg);
    -webkit-transform: translateY(0px) rotate(55deg);
    -ms-transform: translateY(0px) rotate(55deg);
}

.nav.close a.act{ background:none;}

.nav a:after,.nav a:before {
    background-color: #fff;
    display: block;
    height: 4px;
    left: 0;
    position: absolute;
    width: 100%;
    content:'';
    transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
}

.nav a:after { top: 10px;}

.nav a:before { top: -10px;}

.nav.close a:after, .nav.close a:before { top: 0;}

.nav.close a:before {
    background-color: #08903d;
    transform: translateY(0px) rotate(-45deg);
    -webkit-transform: translateY(0px) rotate(-45deg);
    -ms-transform: translateY(0px) rotate(-45deg);
}

.nav.close a:after {
    background-color: #08903d;
    transform: translateY(0px) rotate(45deg);
    -webkit-transform: translateY(0px) rotate(45deg);
    -ms-transform: translateY(0px) rotate(45deg);
}

/* ----------------------------------------------------------------
        首页.HOME
-----------------------------------------------------------------*/
/* 视频 */
.section { position: relative; overflow: hidden;}
.section .bg { position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.section .bg video { width:100%; position:absolute; bottom:0px;}
.section .bg img { display: block; width: 100%; height: 100%;}

#loading-mask {
    background: #000; 
    height: 100%;  
    left: 0;  
    opacity: 1;   
    filter: alpha(opacity=100);  
    position: fixed;   
    text-align: center;  
    top: 0;   
    width: 100%;  
    z-index: 999999999;
}

.loading-img { 
    height: 100%; 
    left: 0; 
    position: fixed; 
    top: 50%;  
    width: 100%;
}
/* 视频.end */

/* 点击按钮滑动到指定位置 */
#fullPage-nav { _display: none; font-size: 12px;}
#fullPage-nav li { width: 55px; height: 21px; margin: 10px 0 0; vertical-align: middle; list-style-type:none;}
#fullPage-nav li a { float: left; width: 21px; height: 21px; color: #8F9DA4; text-decoration: none; text-align: left; background: url(../images/dot.png) 5px 5px no-repeat;}
#fullPage-nav li .active { background-position: 0 bottom;}
#fullPage-nav span { display: none;}
.fullPage-tooltip { float: left; top: 0; margin-right: 5px; font-size: 14px;font-family: '微软雅黑','Raleway', sans-serif;font-weight: bold; color: #8F9DA4; line-height: 21px;}
/* 点击按钮滑动到指定位置.end */

/* ----------------------------------------------------------------
        SEO.联系方式
-----------------------------------------------------------------*/
.sidebar{ position: fixed; right: 0; bottom: 200px;  width: 55px; background: rgba(0,0,0,0.5); padding: 10px 0; border-radius:10px 0 0 10px; z-index:9999; }

.sidebar li{ 
    height: 50px; 
    width: 200px; 
    border-radius:5px 0 0 5px;
    -webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    -o-transition: all 0.5s;
    transition: all 0.5s;
    list-style-type:none;
}

.sidebar li img{ display: block;float: left;}
.sidebar li:hover{ margin-left: -120px; background: rgba(0,0,0,0.8);  list-style-type:none;}
.sidebar li span{ font-size: 16px;color: #fff;float: left;padding-top: 14px;}

/* ----------------------------------------------------------------
        Footer.底部
-----------------------------------------------------------------*/
.footers {
    width: 100%;
    height: 200px;
    background-color: #333;
    border-top: 5px solid #1e1e1e;
}

.footers .container {
    width: 1380px;
    margin: 0 auto;
}

/* 二维码 */
.footers .container .code {
    width: 151px;
    height: 151px;
    float: left;
    padding-top: 20px;
    text-align: center;
}

.footers .container .code img {
    width: 95px;
    height: 95px;
}

.footers .container .code p {
    color: #fff;
}

.footers .container .code p a {
    color: #fff;
}
/* #二维码 */

/* 联系方式 */
.footers .container .cont {
    width: 620px;
    float: left;
    padding-top: 20px;
    margin-left: 20px;
}

.footers .container .cont p {
    color: #fff;
    line-height: 25px;
}

.footers .container .cont p a {
    color: #fff;
}
/* #联系方式 */

/* 电话 */
.footers .container .ctel {
    width: 400px;
    float: right;
    padding-top: 20px;
}

.footers .container .ctel p {
    color: #fff;
    margin: 20px 0;
}

.footers .container .ctel p a {
    color: #fff;
}

.footers .container .ctel img {
    width: 60px;
    height: 60px;
    float: left;
    margin-right: 10px;
}

.footers .container .ctel .ctel-text {
    padding-top: 7px;
}

.footers .container .ctel .ctel-text font {
    color: #fff;
    font-weight: normal;
    font-family: '微软雅黑';
}

.footers .container .ctel .ctel-text span {
    color: #fff;
    font-size: 24px;
    font-weight: bold;
    font-family: '微软雅黑';
}
/* #电话 */

/* 滚动条图片 */
.casebanner {
    margin-top: 80px;
}

/* 详细页.产品/招聘 */
.deta-bg {
    width: 100%;
    margin: 0 auto; 
    margin-top: 20px;
}

/* ----------------------------------------------------------------
        手机版.Phone
-----------------------------------------------------------------*/
/* 菜单导航 */
#l_dhzk{ width:100%; height:100%; position: fixed; top:0px; left:0px; z-index:999; display:none;}

#l_dhzk ul li{ width:33.33%; float:left; text-align:center; position:relative; overflow:hidden; list-style-type:none; }

#l_dhzk ul li:hover{}

.l_dhzkconnr{ height:145px; position:absolute; top:50%; left:0px; margin:-72.5px 0 0 0px; width:100%;}

.dhico{  display:inline-block;}

#l_dhzk h3{ font-size:40px; color:#333333; margin-top:13px;}

#l_dhzk p{ font-size:14px; color:#333333; margin-top:5px;}

#l_dhzk i{ display:inline-block; width:40px; height:1px; background:#23ac38; margin-top:5px;}

.dhico01{ width:50px; height:57px; background:url(../images/navtb1.png) no-repeat top center;}

.dhico02{ width:50px; height:57px; background:url(../images/navtb2.png) no-repeat top center;}

.dhico03{ width:50px; height:57px; background:url(../images/navtb3.png) no-repeat top center;}

.dhico04{ width:50px; height:57px; background:url(../images/navtb4.png) no-repeat top center;}

.dhico05{ width:50px; height:57px; background:url(../images/navtb5.png) no-repeat top center;}

.dhico06{ width:50px; height:57px; background:url(../images/navtb6.png) no-repeat top center;}

.l_dhzk01{ background:#dddddd;}

.l_dhzk02{ background:#eeeeee;}

.l_dhzk03{ background:#dddddd;}

.l_dhzk04{ background:#eeeeee;}

.l_dhzk05{ background:#dddddd;}

.l_dhzk06{ background:#eeeeee;}

.l_dhzk01.active, .l_dhzk02.active, .l_dhzk03.active, .l_dhzk04.active, .l_dhzk05.active, .l_dhzk06.active{ 
    width:100%; height:100%;background-size:100% 100%;-moz-background-size:100% 100%;-webkit-background-size:100% 100%;-o-background-size:100% 100%;
}

.l_dhzk01.active{background:#e4e4e4;opacity: 0.9; }

.l_dhzk02.active{background:#e4e4e4;opacity: 1; }

.l_dhzk03.active{background:#e4e4e4;opacity: 0.9;}

.l_dhzk04.active{background:#e4e4e4;opacity: 1; }

.l_dhzk05.active{background:#e4e4e4;opacity: 0.9; }

.l_dhzk06.active{background:#e4e4e4;opacity: 1; }

#l_dhzk a{ display:block;}

.l_dhzkhxtop{ width:100%; height:4px; background:#23ac38; position:absolute; left:0px; top:0px; display:none;}

.l_dhzkhxbottom{width:100%; height:4px; background:#23ac38; position:absolute; right:0px; top:100%;display:none;}

.l_dhzkhxleft{width:4px; background:#23ac38; position:absolute; left:0px; bottom:0px;display:none;}

.l_dhzkhxright{width:4px; background:#23ac38; position:absolute; right:0px; top:0px;display:none;}

#l_dhzk ul li:hover .l_dhzkhxtop{ display:block;}

#l_dhzk ul li:hover .l_dhzkhxbottom{ display:block;}

#l_dhzk ul li:hover .l_dhzkhxleft{ display:block;}

#l_dhzk ul li:hover .l_dhzkhxright{ display:block;}
/* 菜单导航.end */

/* ----------------------------------------------------------------
        根据分辨率来判断显示
-----------------------------------------------------------------*/
/* 菜单导航,头部,关闭图标 */
@media screen and (max-width: 440px) { 
    .nav {top:15px;}
}
@media screen and (min-width: 1024px) {
    .nav{display:none;}
}
@media screen and (max-width: 1024px) { 
    .navtop2{display:none;}
    .tongl{
        background-color: #fff;
    }
}